import React, { useEffect, useState } from 'react';
import {Button} from "antd";
import {CheckSquareOutlined, CloseSquareOutlined, DownOutlined} from '@ant-design/icons';
import {$CheckPost} from "../../api/postapi";
import MyNotification from "../../components/MyNotification/MyNotification";
export default function Post2({post})
{
    //通知框状态
    const [notiMsg, setNotiMsg] = useState({ type: "", description: "" });
    //阅读全文按钮的状态设置
    const [read,setRead]=useState(true);
    //阅读全文的点击事件
    const essay=()=>{
        setRead(!read);
    }
        const Check= async (value)=>{
        const response =await $CheckPost({postId:post.postId,type:value});
            console.log(response);
            if (response.code){
                setNotiMsg({ type: "success", description: response.message });
            }else{
                setNotiMsg({ type: "error", description: response.message })
            }
        }
    return(
        <div style={{marginBottom:'10px',borderBottom:'4px solid rgb(221, 240, 238)',marginTop:'10px'}}>
            <div className='top' style={{display:'flex',justifyContent:'space-between'}}>
                <div style={{fontWeight:'bold',fontSize:'30px',display:'flex',marginLeft:'30px',marginBottom:'20px'}}>{post.title}</div>
                <div className='button' style={{display:'flex',marginRight:'20px'}}>
                    <Button icon={<CheckSquareOutlined />} style={{backgroundColor:'rgb(1, 186, 173)',color:'white',marginRight:'20px',borderRadius:'20px'}} onClick={()=>Check('true')}>通过</Button>
                    <Button icon={<CloseSquareOutlined />} style={{backgroundColor:'rgb(204, 204, 204)',color:'white',borderRadius:'20px'}} onClick={()=>Check('false')}>驳回</Button>
                </div>
            </div>
            <div style={{marginLeft:'30px',marginBottom:'20px'}}>
                 <span>
            {read ? post.content.substring(0, 70) : post.content}
                     {post.content.length > 70 && (
                         <Button
                             type="link"
                             onClick={essay}
                             style={{color: 'rgb(138, 216, 210)'}}
                         >
                             {read ? '阅读全文' : '收起全文'}
                             <DownOutlined/>
                         </Button>

                     )}
          </span>
            </div>
            <MyNotification notiMsg={notiMsg}/>
        </div>
    )
}
